<template>
    <div>
        <r-search :searchHandle="searchHandleAdd" />
        <r-table :isSelection="true" :isPagination="true" :tableData="tableData" :tableCols="tableCols" :tablePage="tablePage" @refresh="init()"></r-table>
        <r-form :formRules="formRules" :formHandle="formHandle" :formData="formData" :formCols="formCols" ref="elForm" labelWidth="200px" dialogWidth="1000px" :isHandle="true" />
    </div>
</template>
<script>
export default {
    data() {
        return {

            searchHandleAdd: [
                {
                    label: "创建分类",
                    type: "success",
                    handle: e => this.elFormVisible()
                },
            ],

            tableData: [
            ],
            tableCols: [
                {
                    label: 'ID',
                    prop: 'id',
                    // theme: e => e.status ? 'primary' : 'danger', type: "tag",
                },
                {
                    label: '分类名称',
                    prop: 'name'
                },
                {
                    label: '分类图片',
                    prop: 'img',
                    type: 'image'
                },
                {
                    label: '分类简介',
                    prop: 'brief'
                },
                {
                    label: '新增时间',
                    prop: 'ctime',
                    width:160
                },
                {
                    label: '操作',
                    type: "button",
                    width:170,
                    btnList: [
                        {
                            label: '编辑',
                            type: 'primary',
                            // isShow: e => e.orderId == '123' ? true : false,
                            handle: (row) => this.elFormDetail(row)
                        },
                        {
                            label: '删除',
                            type: 'primary',
                            handle: (row) => this.TableDel('/sys/shopGoodsCategory/delete', { id: row.id }),
                        },
                    ]
                }

            ],
            tablePage: { limit: 10, page: 1, total: 0 },
            formData: {
                name: '',
                brief: "",
                categoryId: "",
                type: "",
                costPrice: "",
                price: "",
                img: "",
                goodsDetails: "",
                status: ""
            },
            formCols: [
                { type: "input", label: "分类名称", width: 450, prop: "name", },
                { type: "upload", label: "分类图片", width: 200, prop: "img", remark: '只能上传jpg/png/MP4格式文件，文件不能超过500kb', rmblock: true, success: (res, file) => { this.$refs.elForm.loading = false; this.formData.img = res.data.imgPath } },
                { type: "input", label: "分类简介", width: 450, prop: "brief", },
            ],
            formRules: {
                name: [
                    { required: true, message: '请输入分类名称', trigger: 'blur' },
                ],
                img: [
                    { required: true, message: '请输入分类简介', trigger: 'blur' },
                ],
                brief: [
                    { required: true, message: '请输入分类分类', trigger: 'blur' },
                ],
            },
            formHandle: [
                {
                    label: "取消",
                    handle: e => this.elFormVisible(),
                },
                {
                    label: "确定",
                    type: "success",
                    handle: e => this.elFormSubmit(),
                },

            ],
        };
    },
    components: {},
    computed: {},
    mounted() {
        this.init()
    },
    methods: {
        async init() {
            let parm = { ...this.tablePage, ...this.searchData }
            let res = await this.api.takecfylist(parm)
            if (res) {
                this.tablePage.total = res.data.total
                this.tableData = res.data.list
            }

        },
        async elFormSubmit(row) {
            // console.log(row);
            if (row) {
                await this.api.takecfyupdate(row)
            } else {
                let res = null
                if (this.formData.id) {
                    res = await this.api.takecfyupdate(this.formData) //advertsave
                } else {
                    res = await this.api.takecfyadd(this.formData)
                }
                if (res) {
                    this.elFormVisible()
                    this.init()
                }
            }

        },
        elFormDetail(row) {
            Object.keys(this.formData).forEach(key => {
                this.formData[key] = row[key]
            })
            this.formData.id = row.id;
            // if (this.formCols[1].label == '登录密码') {
            //     this.formCols.splice(1, 1)
            // }

            this.elFormVisible()
        },
    }
};
</script>
<style scoped lang='scss'>
.el-icon-search {
  margin-right: 10px;
}
.Tip {
  margin-left: 20px;
}
</style>
